{extend name="public/world"}
{block name="style"}
<style type="text/css">
h1 {
    text-align: center;
    font-size: 30px;
    font-weight: 500;
    line-height: 1;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}
small {
    font-size: 65%;
    font-weight: 300;
    line-height: 1;
    color: #777;
}
.layui-btn-group2{
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    margin: 20px 0;
    width: 100%;
    text-align: center;
}
</style>
{/block}
{block name="container"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <h1 id="title">记账凭证  <small>{:substr($period['period'],0,4)}年 第 {:substr($period['period'],4)} 期</small></h1>
            <div id="period_code">凭证号：{$period['period_code']}</div>
            <div id="printinfo">
                <table class="layui-table" lay-size="sm">
                    <colgroup>
                        <col width="250">
                        <col width="400">
                        <col width="100">
                        <col width="100">
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th>摘要</th>
                        <th>科目</th>
                        <th>借方金额</th>
                        <th>贷方金额</th>
                        <th>备注</th>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="data" id="val"}
                        <tr>
                            {if $key==0 || $key==$num}
                            <td{if $key==0} rowspan="{$num}" style="position: static;"{/if}>{$val['description']}</td>
                            {/if}
                            <td>{$val['code_name']}</td>
                            <td>{$val['debit']}</td>
                            <td>{$val['credit']}</td>
                            {if $key==0 || $key==$num}
                            <td{if $key==0} rowspan="{$num}" style="position: static;"{/if}>{$val['market']}</td>
                            {/if}
                        </tr>
                    {/volist}
                    </tbody>
                </table>
            </div>
            <div class="footer_code">
                <div style="float: right;width: 200px;">复核人：{$period.check_user}</div>
                <div style="float: right;width: 200px;">制表人：{$period.create_user}</div>
            </div>
            <div class="layui-btn-group2">
                {if $period.luck==0 && $period.status==1}
                <button type="button" class="layui-btn layui-btn-sm layui-btn-danger toCheck">反审核</button>
                {/if}
                {if $period.luck==0 && $period.status==0}
                <button type="button" class="layui-btn layui-btn-sm layui-btn-normal toCheck">审核</button>
                {/if}
                <button type="button" class="layui-btn layui-btn-sm printReport">打印</button>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    layui.use(['form','table'], function() {
        var $ = layui.jquery
            , table = layui.table
            , form = layui.form;

        //打印
         $('.printReport').click(function() {
             let tablelayid = 'dataTable'
            let titleName = $('#title').html();
            let period_code = $('#period_code').html();
            let footer_code = $('.footer_code').html();
            let v = document.createElement("div");
            let f = [`<head><br><div style='text-align:center;font-size:25px;font-weight:bolder'>${titleName}</div><div style='font-size:16px;font-weight:bolder'>${period_code}</div>`,"<style>", "body{font-size: 16px; color: #666;}", "table{width: 100%; border-collapse: collapse; border-spacing: 0;}","th,td{line-height: 20px; padding: 9px 10px; border: 1px solid #ccc; text-align: center; font-size: 16px; color: #666;}","a{color: #666; text-decoration:none;}", "*.layui-hide{display: none}","</style>", "</head>"].join("");
            $(v).append($("#printinfo").html());
            /*$(v).append($(".layui-table-box").find(".layui-table-header").html());
            $(v).find("tr").after($("[lay-id=\"" + tablelayid + "\"] .layui-table-body.layui-table-main table").html());
            $(v).find("th.layui-table-patch").remove();
            $(v).find(".layui-table-col-special").remove();*/
            //页脚展示打印人，打印时间
            let footer = [`<footer><div>${footer_code}</div></footer >`].join("");
            let h = window.open("打印窗口", "_blank");
            h.document.write(f + $(v).prop("outerHTML") + footer);
            h.document.close();
            h.print();
            h.close();
        });
    });
</script>
{/block}